<!DOCTYPE html>
<html>
    <head>
       <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>JSP Page</title>
        <!-- include jQuery + carouFredSel plugin -->
        <script type="text/javascript" language="javascript" src="/js/jquery-1.8.2.min.js"></script>
        <script type="text/javascript" language="javascript" src="/js/carousel/jquery.carouFredSel-6.1.0-packed.js"></script>
		<link href="/css/carousel/carouFredSel.css" rel="stylesheet" type="text/css"/>

		<script type='text/javascript' src='/js/menu/jquery.hoverIntent.minified.js'></script>
		<script type='text/javascript' src='/js/menu/jquery.dcmegamenu.1.3.3.js'></script>
		<link href="/css/menu/black.css" rel="stylesheet" type="text/css" />
		<link href="/css/menu/dcmegamenu.css" rel="stylesheet" type="text/css" />
		<link href="/css/css.css" rel="stylesheet" type="text/css" />
      	<script src='/js/lightbox/lightBox.js' type='text/javascript'></script>
      
        <script>
			   $(document).ready(function($){
					$('#mega-menu-2').dcMegaMenu({
						rowItems: '4',
						speed: 'fast',
						effect: 'slide',
					});
				});
        </script>


        <style>
		
        </style>
    </head>
    <body>
		<header style="height:100px; ">
		
		</header>
		
		
		<div class="black">  
<ul id="mega-menu-2" class="mega-menu">
	<li><a href="home.html">Home</a></li>
	<li><a href="test.html">Products</a>
		<ul>
			<li><a href="#">Mobile Phones &#038; Accessories</a>
				<ul>
					<li><a href="#">Product 1</a></li>
					<li><a href="#">Product 2</a></li>
					<li><a href="#">Product 3</a></li>
				</ul>
			</li>
			<li><a href="#">Desktop</a>
			    <ul>
					<li><a href="#">Product 4</a></li>
					<li><a href="#">Product 5</a></li>
					<li><a href="#">Product 6</a></li>
					<li><a href="#">Product 7</a></li>
					<li><a href="#">Product 8</a></li>
					<li><a href="#">Product 9</a></li>
				</ul>
			</li>
			<li><a href="#">Laptop</a>
			    <ul>
					<li><a href="#">Product 10</a></li>
					<li><a href="#">Product 11</a></li>
					<li><a href="#">Product 12</a></li>
					<li><a href="#">Product 13</a></li>
				</ul>
			</li>
			<li><a href="#">Accessories</a>
			    <ul>
					<li><a href="#">Product 14</a></li>
					<li><a href="#">Product 15</a></li>
				</ul>
			</li>
			<li><a href="#">Software</a>
			  <ul>
				<li><a href="#">Product 16</a></li>
					<li><a href="#">Product 17</a></li>
					<li><a href="#">Product 18</a></li>
					<li><a href="#">Product 19</a></li>
			  </ul>
			</li>
		</ul>
	</li>
	<li><a href="#">Sale</a>
		<ul>
			<li><a href="#">Special Offers</a>
	<ul>
		<li><a href="#">Offer 1</a></li>
		<li><a href="#">Offer 2</a></li>
		<li><a href="#">Offer 3</a></li>
	</ul>
	</li>
	<li><a href="#">Reduced Price</a>
	<ul>
		<li><a href="#">Offer 4</a></li>
		<li><a href="#">Offer 5</a></li>
		<li><a href="#">Offer 6</a></li>
		<li><a href="#">Offer 7</a></li>
	</ul>
</li>
	<li><a href="#">Clearance Items</a>
	<ul>
		<li><a href="#">Offer 9</a></li>

	</ul>
</li>
	<li class="menu-item-129"><a href="#">Ex-Stock</a>
	<ul>
		<li><a href="#">Offer 10</a></li>
		<li><a href="#">Offer 11</a></li>
		<li><a href="#">Offer 12</a></li>
		<li><a href="#">Offer 13</a></li>
	</ul>
</li>
</ul>
</li>
<li><a href="#">About Us</a>
<ul>
	<li><a href="#">About Page 1</a></li>
	<li><a href="#">About Page 2</a></li>

</ul>
</li>
<li><a href="#">Services</a>
<ul>
	<li><a href="#">Service 1</a>
	<ul>
		<li><a href="#">Service Detail A</a></li>
		<li><a href="#">Service Detail B</a></li>
	</ul>
</li>
<li><a href="#">Service 2</a>
	<ul>
		<li><a href="#">Service Detail C</a></li>
	</ul>
</li>
	<li><a href="#">Service 3</a>
	<ul>
		<li><a href="#">Service Detail D</a></li>
		<li><a href="#">Service Detail E</a></li>
		<li><a href="#">Service Detail F</a></li>
	</ul>
</li>
	<li><a href="#">Service 4</a></li>
</ul>
</li>
<li><a href="#">Contact us</a></li>
</ul>
</div>


		
		<div id="_body">
		
		
		
		
		

		

			<section class="image_carousel">
				<div class="pagination1">
					dfsdfg
				</div>
				<div id="gallery_container"  class='gallery_container' style="height: 114px;">
					<article>
						<img src="http://caroufredsel.dev7studios.com/examples/images/small/basketball.jpg" alt="basketball" width="180" height="140" />
						<footer>
							<div class="title"> Footer content </div>
							<div class="price"> 2500 VND</div>
						</footer>

					</article>
					<article>
						<img src="http://caroufredsel.dev7studios.com/examples/images/small/beachtree.jpg" alt="beachtree" width="180" height="140" />
						<footer>
							<div class="title"> Footer content </div>
							<div class="price"> 2500 VND</div>
						</footer>
					</article>
					<article>
						<img src="http://caroufredsel.dev7studios.com/examples/images/small/cupcackes.jpg" alt="cupcackes" width="180" height="140" />
						<footer>
							<div class="title"> Footer content </div>
							<div class="price"> 2500 VND</div>
						</footer>
					</article>
					<article>
						<img src="http://caroufredsel.dev7studios.com/examples/images/small/hangmat.jpg" alt="hangmat" width="180" height="140" />
						<footer>
							<div class="title"> Footer content </div>
							<div class="price"> 2500 VND</div>
						</footer>
					</article>
					<article>
						<img src="http://caroufredsel.dev7studios.com/examples/images/small/new_york.jpg" alt="new york" width="180" height="140" />
						<footer>
							<div class="title"> Footer content </div>
							<div class="price"> 2500 VND</div>
						</footer>
					</article>
					<article>
						<img src="http://caroufredsel.dev7studios.com/examples/images/small/laundry.jpg" alt="laundry" width="180" height="140" />
						<footer>
							<div class="title"> Footer content </div>
							<div class="price"> 2500 VND</div>
						</footer>
					</article>
					<article>
						<img src="http://caroufredsel.dev7studios.com/examples/images/small/mom_son.jpg" alt="mom son" width="180" height="140" />
						<footer>
							<div class="title"> Footer content </div>
							<div class="price"> 2500 VND</div>
						</footer>
					</article>
					<article>
						<img src="http://caroufredsel.dev7studios.com/examples/images/small/picknick.jpg" alt="picknick" width="180" height="140" />
						<footer>
							<div class="title"> Footer content </div>
							<div class="price"> 2500 VND</div>
						</footer>
					</article>
					<article>
						<img src="http://caroufredsel.dev7studios.com/examples/images/small/shoes.jpg" alt="shoes" width="180" height="140" />
						<footer>
							<div class="title"> Footer content </div>
							<div class="price"> 2500 VND</div>
						</footer>
					</article>
					<article>
						<img src="http://caroufredsel.dev7studios.com/examples/images/small/paris.jpg" alt="paris" width="180" height="140" />
						<footer>
							<div class="title"> Footer content </div>
							<div class="price"> 2500 VND</div>
						</footer>
					</article>
					<article>
						<img src="http://caroufredsel.dev7studios.com/examples/images/small/sunbading.jpg" alt="sunbading" width="180" height="140" />
						<footer>
							<div class="title"> Footer content </div>
							<div class="price"> 2500 VND</div>
						</footer>
					</article>
					<article>
						<img src="http://caroufredsel.dev7studios.com/examples/images/small/yellow_couple.jpg" alt="yellow couple" width="180" height="140" />
						<footer>
							<div class="title"> Footer content </div>
							<div class="price"> 2500 VND</div>
						</footer>
					</article>
						<article>
						<img src="http://caroufredsel.dev7studios.com/examples/images/small/shoes.jpg" alt="shoes" width="180" height="140" />
						<footer>
							<div class="title"> Footer content </div>
							<div class="price"> 2500 VND</div>
						</footer>
					</article>
					<article>
						<img src="http://caroufredsel.dev7studios.com/examples/images/small/paris.jpg" alt="paris" width="180" height="140" />
						<footer>
							<div class="title"> Footer content </div>
							<div class="price"> 2500 VND</div>
						</footer>
					</article>
					<article>
						<img src="http://caroufredsel.dev7studios.com/examples/images/small/sunbading.jpg" alt="sunbading" width="180" height="140" />
						<footer>
							<div class="title"> Footer content </div>
							<div class="price"> 2500 VND</div>
						</footer>
					</article>
					<article>
						<img src="http://caroufredsel.dev7studios.com/examples/images/small/yellow_couple.jpg" alt="yellow couple" width="180" height="140" />
						<footer>
							<div class="title"> Footer content </div>
							<div class="price"> 2500 VND</div>
						</footer>
					</article>
					<article>
						<img src="http://caroufredsel.dev7studios.com/examples/images/small/yellow_couple.jpg" alt="yellow couple" width="180" height="140" />
						<footer>
							<div class="title"> Footer content </div>
							<div class="price"> 2500 VND</div>
						</footer>
					</article>
				</div>

				<div class="clearfix"></div>
				<style>

					.gallery_pagination{
						text-align: center;
						background: -moz-linear-gradient(center top , #F1F1F1, #CBCBCB) repeat scroll 0 0 transparent;
						border-color: #E0E0E0 #E0E0E0 #B4B4B4;						
						border-style: solid;
						border-width: 1px 0;
						height:30px;
						padding-top:12px;
						text-transform: uppercase;
					}
					.gallery_pagination strong {
						background: none repeat scroll 0 0 #DDDDDD;
						border: 1px solid #CCCCCC;
						color: #000000;
						cursor: default;
						font-weight: bold;
						overflow: visible;
						padding: 6px 8px;
						vertical-align: middle;
						white-space: nowrap;
					}

					.gallery_pagination a {
						background: -moz-linear-gradient(center top , #FFFFFF, #EFEFEF) repeat scroll 0 0 #F6F6F6;
						border: 1px solid #CCCCCC;
						color: #0033CC;
						cursor: pointer;
						overflow: visible;
						padding: 6px 9px;
						vertical-align: middle;
						white-space: nowrap;
						text-decoration: none;
						text-align: center;
					}
					.gallery_pagination a:hover {
						background: -moz-linear-gradient(center top , #FFFFFF, #EBEBEB) repeat scroll 0 0 #F3F3F3;
						border-color: #999999;
						outline: 0 none;
						padding: 6px 9px;
					}
				</style>
				<div class="gallery_pagination" id="foo_pag">
					<a rel="first" href="">Đầu trang</a>
					<a rel="prev" href="">Trước</a>
					<a href="">1</a>
					<a href="">2</a>
					<strong>3</strong>
					<a href="">4</a>
					<a rel="next" href="">Tiếp</a>
					<a rel="last" href="">Cuối cùng</a>
				</div>
			</section>




		</div>
		
		<footer style="height:100px">
		</footer>
    </body>
</html>

